<template>
  <view class="bg-white">
    <cu-custom bgColor="bg-white" :isBack="true">
      <block slot="content">草稿箱编辑</block>
    </cu-custom>
    <view style="padding: 15rpx">
      <view class="action" style="margin-bottom: 10px">
        <text class="cuIcon-titles" style="color: #1e5eff"></text>
        <text style="color: #000000; font-weight: bold; font-size: 25rpx">
          基础信息填写
        </text>
      </view>
      <view>
        <view>
          <image
            style="width: 100rpx; height: 100rpx"
            :src="dataObj.avatar"
          ></image>
        </view>
        <view class="cu-form-group">
          <view class="title" style="font-size: 16px">姓名</view>
          <my-seach-select
            range-key="text"
            value-key="value"
            dict-code="sys_user,realname,id"
            v-model="userId"
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">公司</view>
          <input
            v-model="dataObj.company_dictText"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">性别</view>
          <input
            v-model="dataObj.sex_dictText"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">工号</view>
          <input
            v-model="dataObj.workNumber"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">联系电话</view>
          <input
            v-model="dataObj.phone"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">年龄</view>
          <input
            v-model="dataObj.age"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">身份证号</view>
          <input
            v-model="dataObj.idCard"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <!-- <view class="cu-form-group" style="background-color: #F4F4F4;border-radius: 15px;margin-top: 15rpx;">
					<view  class="title" style="font-size: 16px;">身份证地址</view>
					<input v-model="dataObj.idCardAddress" placeholder="请输入" name="input"
						style="text-align:right;font-size: 20rpx;" disabled />
				</view> -->
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">工龄</view>
          <input
            v-model="dataObj.workAge"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">出生年月</view>
          <input
            v-model="dataObj.birthday"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">进厂时间</view>
          <input
            v-model="dataObj.inTime"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">岗位</view>
          <input
            v-model="dataObj.post"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">分类</view>
          <input
            v-model="dataObj.classification"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">班次</view>
          <input
            v-model="dataObj.classes"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">部门编码名称</view>
          <input
            v-model="dataObj.departName"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
        <view
          class="cu-form-group"
          style="
            background-color: #f4f4f4;
            border-radius: 15px;
            margin-top: 15rpx;
          "
        >
          <view class="title" style="font-size: 16px">计费标准</view>
          <input
            v-model="dataObj.freightBasis_dictText"
            placeholder="请输入"
            name="input"
            style="text-align: right; font-size: 20rpx"
            disabled
          />
        </view>
      </view>
    </view>
    <view style="padding: 15rpx; margin-top: 10rpx">
      <view class="action" style="margin-bottom: 10px">
        <text class="cuIcon-titles" style="color: #1e5eff"></text>
        <text style="color: #000000; font-weight: bold; font-size: 25rpx">
          合同签订时间信息
        </text>
      </view>
      <!-- <view v-for="(item, index) in dataObj.contractRenewals" :key="index">
				<view class="cu-form-group" style="background-color: #F4F4F4;border-radius: 15px;margin-top: 15rpx;">
					<view  class="title" style="font-size: 16px;">续签开始时间</view>
					<input v-model="item.contractStartTime" placeholder="请输入" name="input"
						style="text-align:right;font-size: 20rpx;" disabled />
				</view>
				<view class="cu-form-group" style="background-color: #F4F4F4;border-radius: 15px;margin-top: 15rpx;">
					<view  class="title" style="font-size: 16px;">续签结束时间</view>
					<input v-model="item.contractEndTime" placeholder="请输入" name="input"
						style="text-align:right;font-size: 20rpx;" disabled />
				</view>
				<view class="cu-form-group" style="background-color: #F4F4F4;border-radius: 15px;margin-top: 15rpx;">
					<view  class="title" style="font-size: 16px;">详情</view>
					<input v-model="item.details" placeholder="请输入" name="input"
						style="text-align:right;font-size: 20rpx;" disabled />
				</view>
			</view> -->
      <view style="margin: 20rpx 0">
        <radio-group class="block" v-model="contractType" @change="RadioChange">
          <view>
            <text
              style="
                font-size: 14rpx;
                color: #101317;
                margin-left: 20rpx;
                margin-right: 50rpx;
              "
              >合同类型</text
            >
            <radio value="劳务合同" :checked="contractType === '1'">
              <text
                style="
                  margin-left: 20rpx;
                  z-index: 9;
                  color: #b8b8b8;
                  font-size: 14rpx;
                "
                >劳务合同</text
              >
            </radio>
            <radio
              value="劳动合同"
              :checked="contractType === '2'"
              style="margin-left: 15px"
            >
              <text
                style="
                  margin-left: 20rpx;
                  z-index: 9;
                  color: #b8b8b8;
                  font-size: 14rpx;
                "
                >劳动合同</text
              >
            </radio>
          </view>
        </radio-group>
      </view>
      <view
        class="cu-form-group"
        style="
          background-color: #f4f4f4;
          border-radius: 15px;
          margin-top: 15rpx;
        "
      >
        <view class="title" style="font-size: 16px">合同开始日期</view>
        <picker mode="date" :value="createTime" @change="DateChange">
          <view style="text-align: right; font-size: 20rpx; line-height: 15px">
            {{ createTime ? createTime : "请选择" }}
          </view>
        </picker>
      </view>
      <view
        class="cu-form-group"
        style="
          background-color: #f4f4f4;
          border-radius: 15px;
          margin-top: 15rpx;
        "
      >
        <view class="title" style="font-size: 16px">合同结束日期</view>
        <!-- <uni-datetime-picker v-model="endTime" type="line" clear-icon>
					<view style="text-align:right;margin-right: 20rpx;font-size: 20rpx;">
						{{endTime!=''?endTimeShow:'请选择'}}
					</view>
				</uni-datetime-picker> -->
        <picker mode="date" :value="endTime" @change="DateChangeEndTime">
          <view style="text-align: right; font-size: 20rpx; line-height: 15px">
            {{ endTime ? endTime : "请选择" }}
          </view>
        </picker>
      </view>
      <view
        class="cu-form-group"
        style="
          background-color: #f4f4f4;
          border-radius: 15px;
          margin-top: 15rpx;
        "
      >
        <view class="title" style="font-size: 16px">合同签订日期</view>
        <!-- <uni-datetime-picker v-model="signTime" type="line" clear-icon>
					<view style="text-align:right;margin-right: 20rpx;font-size: 20rpx;">
						{{signTime!=''?signTimeShow:'请选择'}}
					</view>
				</uni-datetime-picker> -->
        <picker mode="date" :value="signTime" @change="DateChangeSignTime">
          <view style="text-align: right; font-size: 20rpx; line-height: 15px">
            {{ signTime ? signTime : "请选择" }}
          </view>
        </picker>
      </view>
      <view
        class="cu-form-group"
        style="
          background-color: #f4f4f4;
          border-radius: 15px;
          margin-top: 15rpx;
        "
      >
        <view class="title" style="font-size: 16px">合同间隔时间</view>
        <input
          v-model="intervalTime"
          placeholder=""
          name="input"
          style="text-align: right; font-size: 20rpx"
          disabled
        />
      </view>
    </view>

    <view style="padding: 15rpx; margin-top: 10rpx">
      <view class="action" style="margin-bottom: 10px">
        <text class="cuIcon-titles" style="color: #1e5eff"></text>
        <text style="color: #000000; font-weight: bold; font-size: 25rpx">
          合同附件上传
        </text>
      </view>
      <view style="margin-top: 30rpx" class="example-body">
        <uni-file-picker
          limit="5"
          file-mediatype="image"
          @select="select"
          :value="contractFilesList"
        ></uni-file-picker>
      </view>
    </view>

    <view style="padding: 15rpx; margin-top: 10rpx">
      <view class="action" style="margin-bottom: 10px">
        <text class="cuIcon-titles" style="color: #1e5eff"></text>
        <text style="color: #000000; font-weight: bold; font-size: 25rpx">
          合同补充条款上传
        </text>
      </view>
      <view style="margin-top: 30rpx" class="example-body">
        <uni-file-picker
          limit="5"
          file-mediatype="image"
          @select="selectTwo"
          :value="contractSupplementsList"
        ></uni-file-picker>
      </view>
    </view>

    <view style="padding: 0 0 30rpx 15rpx">
      <view
        style="
          display: flex;
          margin-top: 15px;
          justify-content: space-between;
          align-items: center;
        "
      >
        <view
          @click="submit"
          style="
            padding: 30rpx 110rpx;
            margin-left: 20rpx;
            margin-top: 20rpx;
            background-color: rgba(30, 94, 255, 1);
            border-radius: 30rpx;
            color: #ffffff;
          "
        >
          提交审核
        </view>
        <view
          @click="save"
          style="
            padding: 30rpx 110rpx;
            margin-left: 20rpx;
            margin-top: 20rpx;
            border-radius: 30rpx;
            background-color: rgba(255, 173, 4, 1);
            color: #ffffff;
          "
        >
          保存
        </view>
      </view>
    </view>
    <uni-popup ref="submitFlag" background-color="#fff" :mask-click="false">
      <view
        style="
          text-align: center;
          background-color: #ffffff;
          padding: 11rpx;
          width: 580rpx;
          height: 470rpx;
          border-radius: 42rpx;
        "
      >
        <view>
          <view class="submit-item">
            <image class="submit-icon" src="@/static/duihaoblue.png" />
          </view>
          <view style="margin-top: 28rpx">
            <text class="submit-text">合同审核已经提交</text>
          </view>
          <view style="color: rgba(150, 150, 150, 1); margin-top: 23rpx">
            <text>已提醒审核人员进行审核</text>
          </view>
          <button
            @click="sureOne"
            style="
              border-radius: 20rpx;
              background-color: rgba(69, 145, 254, 1);
              color: rgba(255, 255, 255, 1);
              width: 300rpx;
              margin-top: 27rpx;
            "
          >
            确定
          </button>
        </view>
      </view>
    </uni-popup>
    <uni-popup ref="draftsFlag" background-color="#fff" :mask-click="false">
      <view>
        <view
          style="
            text-align: center;
            background-color: #ffffff;
            padding: 11rpx;
            width: 580rpx;
            height: 470rpx;
            border-radius: 42rpx;
          "
        >
          <view class="submit-item">
            <image class="submit-icon" src="@/static/drafts.png" />
          </view>
          <view style="margin-top: 28rpx">
            <text class="submit-text">已保存进草稿箱</text>
          </view>
          <view style="color: rgba(150, 150, 150, 1); margin-top: 23rpx">
            <text>您可以进入草稿箱查看</text>
          </view>
          <button
            @click="sureThree"
            style="
              border-radius: 20rpx;
              background-color: rgba(69, 145, 254, 1);
              color: rgba(255, 255, 255, 1);
              width: 300rpx;
              margin-top: 27rpx;
            "
          >
            确定
          </button>
        </view>
      </view>
    </uni-popup>
  </view>
</template>

<script>
import moment from "moment";
import configService from "@/common/service/config.service.js";

export default {
  data() {
    return {
      id: "",
      userId: "",
      contractType: "",
      createTime: "",
      endTime: "",
      signTime: "",
      intervalTime: "",
      contractFilesList: [],
      contractSupplementsList: [],
      dataObj: {
        avatar: "",
        name: "",
        company: "",
        sex: "",
        idCard: "",
        idCardAddress: "",
        workNumber: "",
        phone: "",
        age: "",
        birthday: "",
        inTime: "",
        workAge: "",
        post: "",
        contractRenewals: [
          {
            contractStartTime: "",
            contractEndTime: "",
            details: "",
          },
        ],
      },
    };
  },
  computed: {
    createTimeShow: function () {
      return moment(this.createTime).isValid()
        ? moment(this.createTime).format("MM-DD")
        : moment().format("MM-DD");
    },
    endTimeShow: function () {
      return moment(this.endTime).isValid()
        ? moment(this.endTime).format("MM-DD")
        : moment().format("MM-DD");
    },
    signTimeShow: function () {
      return moment(this.signTime).isValid()
        ? moment(this.signTime).format("MM-DD")
        : moment().format("MM-DD");
    },
  },
  watch: {
    userId: {
      immediate: true,
      handler(val, old) {
        this.userId = val;
        if (this.userId !== "") {
          this.queryUserByUserId();
        }
      },
    },
    createTime: {
      handler(val, old) {
        if (val !== old) {
          this.count();
        }
      },
    },
    endTime: {
      handler(val, old) {
        if (val !== old) {
          this.count();
        }
      },
    },
  },
  onLoad: function (options) {
    this.id = options.id;
    this.userId = options.userId;
    // 在这里可以使用获取到的 id 参数进行后续操作
  },
  mounted() {},
  created() {
    this.getDetail();
  },
  methods: {
    getDetail() {
      this.$http
        .get("/crm_contract/crmContract/queryDetail/" + this.id)
        .then((res) => {
          if (res.data.success) {
            const result = res.data.result;
            this.contractType = result.contractType;
            this.createTime = result.contractStartTime;
            this.endTime = result.contractEndTime;
            this.signTime = result.contractSigningTime;
            this.intervalTime = result.daysFromSigning;
            this.contractFilesList = result?.contractFiles?.map((item) => ({
              uid: item.id,
              name: item.contractFile,
              url: configService.staticDomainURL + "/" + item.contractFile,
            }));
            this.contractSupplementsList = result?.contractSupplements?.map(
              (item) => ({
                uid: item.id,
                name: item.contractSupplementFile,
                url:
                  configService.staticDomainURL +
                  "/" +
                  item.contractSupplementFile,
              })
            );
          }
        });
    },
    queryUserByUserId() {
      this.$http
        .get("/crm_user/crmUser/queryById", {
          params: {
            id: this.userId,
          },
        })
        .then((res) => {
          if (res.data.success) {
            let data = res.data.result;
            this.dataObj.company_dictText = data.company_dictText;
            this.dataObj.company = data.company;
            this.dataObj.sex_dictText = data.sex_dictText;
            this.dataObj.sex = data.sex;
            this.dataObj.idCard = data.idCard;
            this.dataObj.idCardAddress = data.idCardAddress;
            this.dataObj.avatar = data.avatar;
            this.dataObj.workNumber = data.workNo;
            this.dataObj.phone = data.phone;
            this.dataObj.age = data.age;
            this.dataObj.birthday = data.birthday;
            this.dataObj.inTime =
              data.proposedEmploymentDate != null
                ? data.proposedEmploymentDate
                : "";
            this.dataObj.workAge = data.seniority;
            this.dataObj.post = data.post;
            this.dataObj.classification = data.classification;
            this.dataObj.departName = data.departName;
            this.dataObj.freightBasis_dictText = data.freightBasis_dictText;
            this.dataObj.freightBasis = data.freightBasis;
            this.dataObj.classes = data.classes;
            this.dataObj.realname = data.realname;

            this.dataObj.contractRenewals =
              data?.contractRenewals?.length > 0
                ? data.contractRenewals
                : [
                    {
                      contractStartTime: "",
                      contractEndTime: "",
                      details: "",
                    },
                  ];
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    RadioChange(e) {
      this.contractType = e.detail.value;
    },
    count() {
      if (this.endTime != "" && this.createTime != "") {
        var date1 = new Date(this.createTime);
        var date2 = new Date(this.endTime);
        var date =
          (date2.getTime() - date1.getTime()) /
          (1000 * 60 * 60 * 24); /*不用考虑闰年否*/
        if (date >= 0) {
          this.intervalTime = date;
        } else {
          this.$tip.toast("开始时间不能大于结束时间");
          this.intervalTime = "";
        }
      }
    },
    DateChange(e) {
      this.createTime = e.detail.value;
    },
    DateChangeEndTime(e) {
      this.endTime = e.detail.value;
    },
    DateChangeSignTime(e) {
      this.signTime = e.detail.value;
    },
    submit() {
      this.$http
        .put("/crm_contract/crmContract/edit", {
          approvalStatus: "1",
          contractEndTime: this.endTime + " 00:00:00",
          contractFiles: this.contractFilesList?.map((item) => ({
            contractFile: item.serviceUrl,
          })),
          contractNo:
            Math.floor(Math.random() * 10000000000000000000) + Date.now(),
          contractSigningTime: this.signTime + " 00:00:00",
          contractStartTime: this.createTime + " 00:00:00",
          contractSupplements: this.contractSupplementsList?.map((item) => ({
            contractSupplementFile: item.serviceUrl,
          })),
          contractType: this.contractType,
          daysFromSigning: this.intervalTime,
          id: this.id,
          userId: this.userId,
          signType: "1",
          age: this.dataObj.age,
          birthday: this.dataObj.birthday,
          company: this.dataObj.company,
          enterFactoryTime: this.dataObj.enterFactoryTime,
          idCard: this.dataObj.idCard,
          phone: this.dataObj.phone,
          post: this.dataObj.post,
          seniority: this.dataObj.workAge,
          sex: this.dataObj.sex,
          workNo: this.dataObj.workNumber,
          classification: this.dataObj.classification,
          departName: this.dataObj.departName,
          freightBasis: this.dataObj.freightBasis,
          classes: this.dataObj.classes,
          realname: this.dataObj.realname,
        })
        .then((res) => {
          if (res.data.success) {
            this.$http
              .post("/crm_contract/crmContract/submitTrial/" + this.id)
              .then((res) => {
                if (res.data.success) {
                  this.$refs.submitFlag.open("center");
                } else {
                  this.$tip.toast("提交审核失败");
                }
              })
              .catch(() => {
                this.$tip.loaded();
                this.$tip.toast("提交审核失败");
              });
          } else {
            this.$tip.toast(res.data.message);
          }
        })
        .catch(() => {
          this.$tip.loaded();
          this.$tip.toast("提交失败");
        });
    },
    sureOne() {
      this.$refs.submitFlag.close();
      uni.redirectTo({
        url: "/pages/contractList/index",
      });
    },
    save() {
      this.$http
        .put("/crm_contract/crmContract/edit", {
          approvalStatus: "1",
          contractEndTime: this.endTime + " 00:00:00",
          contractFiles: this.contractFilesList?.map((item) => ({
            contractFile: item.serviceUrl,
          })),
          contractNo:
            Math.floor(Math.random() * 10000000000000000000) + Date.now(),
          contractSigningTime: this.signTime + " 00:00:00",
          contractStartTime: this.createTime + " 00:00:00",
          contractSupplements: this.contractSupplementsList?.map((item) => ({
            contractSupplementFile: item.serviceUrl,
          })),
          contractType: this.contractType,
          daysFromSigning: this.intervalTime,
          id: this.id,
          userId: this.userId,
          signType: "1",
          age: this.dataObj.age,
          birthday: this.dataObj.birthday,
          company: this.dataObj.company,
          enterFactoryTime: this.dataObj.enterFactoryTime,
          idCard: this.dataObj.idCard,
          phone: this.dataObj.phone,
          post: this.dataObj.post,
          seniority: this.dataObj.workAge,
          sex: this.dataObj.sex,
          workNo: this.dataObj.workNumber,
          classification: this.dataObj.classification,
          departName: this.dataObj.departName,
          freightBasis: this.dataObj.freightBasis,
          classes: this.dataObj.classes,
          realname: this.dataObj.realname,
        })
        .then((res) => {
          if (res.data.success) {
            this.$refs.draftsFlag.open("center");
          } else {
            this.$tip.toast(res.data.message);
          }
        })
        .catch(() => {
          this.$tip.loaded();
          this.$tip.toast("提交失败");
        });
    },
    sureThree() {
      this.$refs.draftsFlag.close();
      uni.redirectTo({
        url: "/pages/contractList/contractListDrafts/index",
      });
    },
    // 获取上传状态
    select(e) {
      const tempFilePaths = e?.tempFilePaths || [];
      const tempFiles = e?.tempFiles || [];
      Promise.all(
        tempFilePaths.map((item) =>
          this.$http.upload(this.$config.apiUrl + "/sys/common/upload", {
            filePath: item,
            name: "file",
          })
        )
      )
        .then((res) => {
          const fileList = res.map((item, index) => {
            const serviceUrl = item?.data?.message;
            return {
              uuid: tempFiles[index].uuid,
              name: tempFiles[index].name,
              extname: tempFiles[index].extname,
              url: tempFiles[index].url,
              serviceUrl,
            };
          });
          this.contractFilesList = this.contractFilesList.concat(fileList);
        })
        .catch(() => {
          this.$tip.toast("文件上传失败");
          this.contractFilesList = this.contractFilesList?.filter(
            (item) => !!item.serviceUrl
          );
        });
    },
    // 获取上传状态
    selectTwo(e) {
      const tempFilePaths = e?.tempFilePaths || [];
      const tempFiles = e?.tempFiles || [];
      Promise.all(
        tempFilePaths.map((item) =>
          this.$http.upload(this.$config.apiUrl + "/sys/common/upload", {
            filePath: item,
            name: "file",
          })
        )
      )
        .then((res) => {
          const fileList = res.map((item, index) => {
            const serviceUrl = item?.data?.message;
            return {
              uuid: tempFiles[index].uuid,
              name: tempFiles[index].name,
              extname: tempFiles[index].extname,
              url: tempFiles[index].url,
              serviceUrl,
            };
          });
          this.contractSupplementsList =
            this.contractSupplementsList.concat(fileList);
        })
        .catch(() => {
          this.$tip.toast("文件上传失败");
          this.contractSupplementsList = this.contractSupplementsList?.filter(
            (item) => !!item.serviceUrl
          );
        });
    },
  },
};
</script>

<style>
.cu-form-group {
  background-color: #ffffff;
  line-height: 15px;
  padding: 0.5px 15px;
  display: flex;
  align-items: center;
  min-height: 42px;
  justify-content: space-between;
}

.cu-form-group uni-picker .picker {
  line-height: 15px;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 100%;
  text-align: right;
}

.cu-form-group uni-picker::after {
  font-family: cuIcon;
  line-height: 15px;
  display: block;
  content: "\e6a3";
  position: absolute;
  font-size: 17px;
  color: #8799a3;
  width: 31px;
  text-align: center;
  top: 0;
  bottom: 0;
  right: -10px;
  margin: auto;
}

.cu-form-group .title {
  text-align: justify;
  padding-right: 9px;
  font-size: 9px;
  position: relative;
  height: 32px;
  line-height: 32px;
}

/deep/ .uni-radio-input {
  width: 15px;
  height: 15px;
}

.nav-right-image {
  width: 40rpx;
  height: 40rpx;
  margin-left: 15px;
}

.padding-sm {
  padding: 5px;
}

.textStyle {
  font-size: 13px;
  font-family: PingFang SC, PingFang SC;
  font-weight: 400;
  color: #101317;
  line-height: 22px;
}

.cu-form-group .title {
  text-align: justify;
  padding-right: 16rpx;
  font-size: 16rpx;
  position: relative;
  height: 32px;
  line-height: 32px;
}

.submit-icon {
  width: 118rpx;
  height: 118rpx;
  margin-top: 58rpx;
}
</style>
